<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>IIFE</title>
</head>
<body>
    <!-- IIFE：匿名函数自调用 -->
        <!-- 作用：将数据和行为封装到一个匿名函数的内部，达到数据私有的目的 -->
        <!-- 方式：给window添加属性，让外部进行访问，外部只能通过暴露的方法去改变数据 -->
        <!-- 问题：无法依赖其他模块，不能和其他模块之间通信 -->
        <script>
            (function(window) {
                let data = '我是模块A中的数据'
                function fn1() {
                    console.log(`我是fn1打印的${data}`)
                }
                function fn2() {
                    console.log(`我通过fn2修改了data数据`)
                }
                window.moduleA = {
                    fn1,
                    fn2
                }
            })(window)
            console.log(window.moduleA)
            console.log(window.moduleA.fn1)
            console.log(window.moduleA.fn2)
            console.log(window.moduleA.data) // undefined 外部无法访问未暴露的属性数据
            window.moduleA.fn1()    // 我是fn1打印的我是模块A中的数据 只能通过暴露的属性方法去访问数据
            window.moduleA.fn2()    // 我通过fn2修改了data数据 只能通过暴露的属性方法改变数据
        </script>
</body>
</html>